$(".tools-face-list li img").click(function (){
    let div = $(this).clone(true)
    $(".send_text").append(div)
})

let localId
let top_app = new Vue({
    el:"header",
    data:{
        userName:'',
        notifies:[],
        show1:false
    },
    created:function (){
        this.loadNotify()
    },
    methods:{
        loadNotify:function (){
            console.log("执行了加载通知！")
            axios({
                url:"/v1/notify/my",
                method:"GET"
            }).then(function (r) {
                console.log(r.status)
                if (r.status == OK) {
                    console.log("成功加载通知！")
                    console.log(r.data)
                    top_app.notifies = r.data
                }

            })
        },
        addFriends:function (){
            alert("gg")
            console.log("开始添加好友！")
            axios({
                url:"v1/notify/"+this.notifies[0].friendName,
                method:"GET",
            }).then(function (r){
                if(r.data=="OK"){
                    console.log("添加成功！")
                }
            })
        },
        logout:function (){
            axios.post("/logout").then(function (r){

            })
        }
    }
})
let friends_vm = new Vue({
    el:"#friends",
    data:{
        friends:[],
        id2:0,
        search:false,
        friendslist:false,
        searchf:'',
        addf:{},
        sc:false,
        groupAddShow:false,
        groupChatShow:false
    },
    created:function () {
        console.log("执行了方法");
        this.loadFriends();
        setTimeout(function (){
            $($("#friendlist").children("div").get(0)).find(".wp-aside-nav__sub-item-body").addClass("wp-aside-nav__sub-item-body_click")
        },200)
    },
    methods:{
        loadFriends:function () {
            console.log("执行了加载好友！")
            axios({
                url:"/v1/friends/my",
                method:"GET"
            }).then(function (r){
                console.log("成功加载好友！")
                console.log(r)

                if(r.status==OK){
                    friends_vm.friends=r.data
                    if(friends_vm.friends.length!=0){
                        localId=friends_vm.friends[0].userId
                        top_app.userName=friends_vm.friends[0].userName
                        loadChats()
                        console.log(localId)
                        console.log(top_app.userName)
                    }


                }
            })
        },
        changeFont:function (e){

            $(".wp-aside-nav__sub-item-body:eq("+(this.id2)+")").removeClass("wp-aside-nav__sub-item-body_click");
            if(e.target.className=="friend_list"){
                this.id2 = $(e.target).index();
            }else{
                this.id2 = $(e.target).parents(".friend_list").index();
            }
            $(".wp-aside-nav__sub-item-body:eq("+(this.id2)+")").addClass("wp-aside-nav__sub-item-body_click")

            chat_vm.chatHistory = (friends_vm.friends[friends_vm.id2]).chats
            for (let i = 0; i < chat_vm.chatHistory.length; i++) {
                if(chat_vm.chatHistory[i]!=null){
                    chat_vm.chatHistory[i].localid=localId
                }

            }

            friends_vm.$nextTick(()=>{
                var div = document.getElementById("into-view")
                div.scrollIntoView()
            })
        },
        searchFriends:function (){
            friends_vm.sc=true
            console.log("开始寻找好友"+this.searchf+"！")
            axios({
                url:"/v1/friends/"+this.searchf,
                method:"GET",
                }
            ).then(function (r){
                if(r.data==""){
                    console.log("未找到好友")
                    console.log(friends_vm.addf)
                    friends_vm.addf={}
                }else{
                    console.log(r.data)
                    friends_vm.addf=r.data

                    if(r.data.username==friends_vm.friends[0].userName){
                            friends_vm.addf={}
                        }
                    for (let i = 0; i < friends_vm.friends.length; i++) {
                        if (r.data.username == friends_vm.friends[i].friendName) {
                            friends_vm.addf = {}

                        }
                    }
                    }
            })
        },
        addFriend:function (){
            let form = new FormData()
            let f = friends_vm.addf;
            let adiv = "添加好友"
            form.append("message",adiv)
            form.append("userName",f.username)
            form.append("typeId",1)
            axios({
                url:"/v1/notify",
                method:"POSt",
                data:form
            }).then(function (r){
                if(r.data=="OK"){
                    console.log("发送成功")
                    friends_vm.sc=false
                }else{
                    console.log("消息发送失败")
                }
            })
        },
        groupAdd:function (){

        },
        groupChat:function (){

        }


    }
})

let chat_vm = new Vue({
    el:".content-chat-main",

    data:{
        chatHistory:[],
        message:false
    },
    updated:function (){
        this.message=true

        var div = document.getElementById("into-view")
        div.scrollIntoView()

    }
})

let send_vm = new Vue({
    el:"#sendChat",
    data:{

    },
    methods:{
        saveChatHistory:function (){
            console.log("正在发送消息！")
            let chat = document.getElementById("send_text").innerHTML

            let roomId = friends_vm.friends[friends_vm.id2].roomId
            let userId = friends_vm.friends[0].userId
            let masterId = friends_vm.friends[friends_vm.id2].masterId
            console.log(chat)
            let form = new FormData()
            form.append("chat",chat)
            form.append("roomId",roomId)
            form.append("userId",userId)
            form.append("masterId",masterId)
            console.log(form)
            axios({
                url:"/v1/chats",
                method:"post",
                data:form
            }).then(function (r){
                console.log(r.data)
                if(r.data=="OK"){
                    $(".send_text").text("")
                    console.log("发送成功！")
                    friends_vm.loadFriends();
                    setTimeout(function (){
                        var div = document.getElementById("into-view")
                        div.scrollIntoView()
                    },100)

                }else{
                    console.log(r.data)
                }
            })
        },
    }
})

function loadChats(){
    if((friends_vm.friends[friends_vm.id2]).chats.length!=chat_vm.chatHistory.length){
        chat_vm.chatHistory = (friends_vm.friends[friends_vm.id2]).chats
        for (let i = 0; i < chat_vm.chatHistory.length; i++) {
            if(chat_vm.chatHistory[i]!=null){
                chat_vm.chatHistory[i].localid=localId
            }
        }

    }

    console.log(chat_vm.chatHistory)
    console.log(chat_vm.message)
}



setInterval(function (){
    // $("#into-view").load(location.href + " #into_view")
    friends_vm.loadFriends()
    if(chat_vm.message){
        chat_vm.message=false
    }


},1000)
/*
*
 * Moves the scrollbar to start container(sc) of current range
 *
 * @return {WrappedRange}
scrollIntoView(container) {
    const height = $(container).height();
    if (container.scrollTop + height < this.sc.offsetTop) {
        container.scrollTop += Math.abs(container.scrollTop + height - this.sc.offsetTop);
    }

    return this;
}*/
